<%@page import="java.util.List"%>
<%@page import="com.jfinal.plugin.activerecord.Page"%>
<%@page import="com.hongye.app.model.UserAppModel"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" isELIgnored="false"
    pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<% String userNumber=(String)request.getAttribute("userNumber"); %>
<% String openshopNumber=(String)request.getAttribute("openshopNumber"); %>
<% String orderNumber=(String)request.getAttribute("orderNumber"); %>
<% String goodsNumber=(String)request.getAttribute("goodsNumber"); %>
<% String moneyNumber=(String)request.getAttribute("moneyNumber"); %>
<% String shopRatio=(String)request.getAttribute("shopRatio"); %>
<!doctype html>
<html class="fixed">

	<head>

		<!-- Basic -->
		<meta charset="UTF-8">
		<meta name="keywords" content="HTML5 Admin Template" />
		<meta name="description" content="Porto Admin - Responsive HTML5 Template">
		<meta name="author" content="okler.net">
		<!-- Mobile Metas -->
		<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
		<!-- Web Fonts  -->
		<!-- Vendor CSS -->
		<link rel="stylesheet" href="../admin/css/bootstrap.css" />
		<link rel="stylesheet" href="../admin/css/font-awesome/css/font-awesome.css" />
        <link rel="stylesheet" href="../admin/css/select2.css" />
		<!-- Theme CSS -->
		<link rel="stylesheet" href="../admin/css/theme.css" />
		<!-- Skin CSS -->
		<link rel="stylesheet" href="../admin/css/default.css" />
		<!-- Theme Custom CSS -->
		<link rel="stylesheet" href="../admin/css/statistica/style.css" type="text/css" />
		<!-- Theme Custom ../admin/css -->
		<script src="../admin/js/modernizr.js"></script>
	</head>
		
	<body>
		<section role="main" class="content-body" style="margin-top: 50px; height:1500px;">

			<!-- start: page -->
			<section class="panel">
				<header class="panel-heading">
					<h2 class="panel-title">综合统计</h2>
				</header>
				<h4>综合统计图表：</h4>
				 <!-- 用户注册量 -->
				<div class="skillbar clearfix " data-percent="50%">
					<div class="skillbar-title" style="background: #d35400;"><span>用户注册量</span></div>
					<div class="skillbar-bar" style="background: #e67e22;"></div>
					<div class="skill-bar-percent"><font color="2288ff" size="2" ><%=userNumber %>/人</font> </div>
				</div>
				 <!-- 用户开通店铺量 -->
				<div class="skillbar clearfix " data-percent="<%=shopRatio%>%">
					<div class="skillbar-title" style="background: #2980b9;"><span>店铺开通量</span></div>
					<div class="skillbar-bar" style="background: #3498db;"></div>
					<div class="skill-bar-percent"><font color="2288ff" size="2" > <%=openshopNumber %>/人</font></div>
				</div> 
				<!-- 订单成交量 -->
				<div class="skillbar clearfix " data-percent="80%">
					<div class="skillbar-title" style="background: #27ae60;"><span>订单成交量</span></div>
					<div class="skillbar-bar" style="background: #2ecc71;"></div>
					<div class="skill-bar-percent"><font color="2288ff" size="2" > <%=orderNumber %>/个</font></div>
				</div>
				 <!-- 商品上传数量 -->
				<div class="skillbar clearfix " data-percent="60%">
					<div class="skillbar-title" style="background: #46465e;"><span>商品上传数量</span></div>
					<div class="skillbar-bar" style="background: #5a68a5;"></div>
					<div class="skill-bar-percent"><font color="2288ff" size="2" ><%=goodsNumber %>/个</font> </div>
				</div>
				 <!-- 交易额 -->
				 <div class="skillbar clearfix " data-percent="70%">
					<div class="skillbar-title" style="background: #124e8c;"><span>总交易额</span></div>
					<div class="skillbar-bar" style="background: #4288d0;"></div>
					<div class="skill-bar-percent"><font color="2288ff" size="2" > <%=moneyNumber %>/元</font></div>
				</div>
				 <!-- End Skill Bar -->
				 <h4>客户地区分布图：</h4>
				 <div style="padding-top: 20px;">
				 <iframe src="../admin/statistical_analysis.jsp" style="height:500px; background: #efeff5; width: 1200px; padding-top: 10px;"></iframe>
				 </div>
			</section>
		</section>
		
		<!-- Specific Page Vendor -->
		<!-- Vendor -->
		<script src="../admin/js/jquery.js"></script>
		<script src="../admin/js/layer.js"></script>
		<script src="../admin/js/jquery-browser-mobile/jquery.browser.mobile.js"></script>
		<script src="../admin/js/bootstrap/js/bootstrap.js"></script>
		<script src="../admin/js/nanoscroller/nanoscroller.js"></script>
		<script src="../admin/js/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
		<script src="../admin/js/magnific-popup/magnific-popup.js"></script>
		<script src="../admin/js/jquery-placeholder/jquery.placeholder.js"></script>
		
		<!-- Specific Page Vendor -->
	<!--	<script src="js/select2.js"></script>-->
		<script src="../admin/js/jquery-datatables/media/js/jquery.dataTables.js"></script>
		<script src="../admin/js/jquery-datatables-bs3/assets/js/datatables.js"></script>
		
		<!-- Theme Base, Components and Settings -->
		<script src="../admin/js/theme.js"></script>
		
		<!-- Theme Custom -->
		<script src="../admin/js/theme.custom.js"></script>
		
		<!-- Theme Initialization Files -->
		<script src="../admin/js/theme.init.js"></script>


		<!-- Examples -->
		<script src="../admin/js/tables/examples.datatables.default.js"></script>
		<script src="../admin/js/tables/examples.datatables.row.with.details.js"></script>
		<script src="../admin/js/tables/examples.datatables.tabletools.js"></script>
		
		<script type="text/javascript">
		$(document).ready(function(){
			$('.skillbar').each(function(){
				$(this).find('.skillbar-bar').animate({
					width:$(this).attr('data-percent')
				},6000);
			});
		});
		</script>
	</body>

</html>